<!--气象参数列表-->
<template>
	<view>
		<!-- <Listscroll requestUrl="/app/app-mine/device-warning" :params="params" requestType="post">
			<template #default="scope"> -->
				<view class="notice-item" v-for="(item,i) in  meteorologicalParameterList" :key="i" >
					<view class="notice-item__title" @click="addNewMeteorologicalParameter">
						<view class="title">2024-04-15</view>
					</view>
					<view class="operation-button">
						<view class="delete-button" @click="deleteData"></view>
					</view>
					<view class="notice-item__containter">
						 温度：{{item.weather}} <text>℃</text>
						 湿度：{{item.humidity}}%RH
						 </view>
					<view class="notice-item__containter">风向：{{item.windDirection}} 风速：{{item.windSpeed}}m/s</view>
					<view class="notice-item__containter">气压：{{item.pressure}}hPa</view>
				</view>
		<!-- 	</template>
		</Listscroll> -->
		<view class="operation-button">
			<view class="add-button" @click="addNewMeteorologicalParameter"></view>
		</view>
	</view>
</template>

<script setup>
import {ref,onMounted} from "vue"
import Listscroll from "@/components/list-scroll/list-scroll.vue"
import {
	    onLoad,
	  } from "@dcloudio/uni-app";
const params = ref({})
const enterPrise = ref("")
const meteorologicalParameterList= ref([])
// onLoad 接受 跳转过来 页面传递的参数
	  onLoad((option) => {
	   //console.log("optionoption",option.id);
	   //enterPrise.value = option.id;
	   //我传递的是对象，所以解析一下
	  });
	  const addNewMeteorologicalParameter = () => {
		  //console.log("进入编辑气象参数表页");
		  uni.navigateTo({
		  			   url: '/pages/testing/addMeteorologicalParameters'
		  			});
	  }
	  const deleteData = () => {
	  		  console.log("删除气象数据");
			  uni.showModal({
			  		title: '有确认取消的弹窗',
			  		content: '确认要删除该项吗？',
			  		success: function(res) {
			  		if (res.confirm) {
			  			console.log('点击了确认')
			  		} else {
			  			console.log('点击了取消')
			  		}
			  	}
			  })

	  }
	  onMounted(() => {
		let factoryId = uni.getStorageSync('factoryId');
	  	meteorologicalParameterList.value = uni.getStorageSync('meteorologicalParameters');
	  });
</script>

<style lang="scss" scoped>
.notice-item {
	display: flex;
	flex-direction: column;
	background: #fff;
	border-radius: 10rpx;
	margin: 20rpx 30rpx 0 30rpx;
	padding: 20rpx;
	//cursor: pointer;
	position: relative;
}
.notice-item__title {
	display: flex;
	justify-content: space-between;
	margin-bottom: 10rpx;
	.title {
		font-weight: bold;
		font-size: 28rpx;
		color: #455BDF;
		cursor: pointer;
	}
	.type {
		display: inline-block;
		padding: 4rpx 8rpx;
		background: #fef0f0;
		border:2rpx solid #fde2e2;
		color: rgb(251, 69, 59);
		border-radius: 10rpx;
		font-size: 20rpx;
		&.green{
			background: #f0f9eb;
			border-color:#e1f3d8;
			color: #67c23a;
		}
	}
}
.notice-item__containter {
	text-overflow: -o-ellipsis-lastline;
	overflow: hidden;
	text-overflow: ellipsis;
	display: flex;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	font-size: 28rpx;
}
.operation-button{
	position: absolute;
	right:30rpx;
	display: flex;
	flex-direction: row;
	.edit-button{
		width:32rpx;
		height:32rpx;
		background-image:url('@/static/deviceImg/edit-button.png') ;
		background-size: 100% 100%;
		cursor: pointer;
		//width:40rpx;
		// height:30rpx;
		// display: inline-block;
		// padding: 4rpx 8rpx;
		// background: #00aaff;
		// border:2rpx solid #00aaff;
		// color: #ffffff;
		// border-radius: 10rpx;
		// font-size: 20rpx;
		margin-left: 10rpx;
	}
	.delete-button{
		width:32rpx;
		height:32rpx;
		background-image:url('@/static/deviceImg/delete-button.png') ;
		background-size: 100% 100%;
		margin-left: 10rpx;
		cursor: pointer;
		//width:40rpx;delete-button.png
		// height:30rpx;
		// margin-left: 10rpx;
		// display: inline-block;
		// padding: 4rpx 8rpx;
		// background: #fef0f0;
		// border:2rpx solid #fde2e2;
		// color: rgb(251, 69, 59);
		// border-radius: 10rpx;
		// font-size: 20rpx;
	}
	.up-button{
		width:32rpx;
		height:32rpx;
		background-image:url('@/static/deviceImg/up-button.png') ;
		background-size: 100% 100%;
		cursor: pointer;
		// display: inline-block;
		// padding: 4rpx 8rpx;
		// background: #00aaff;
		// border:2rpx solid #00aaff;
		//color: #ffffff;
		// border-radius: 10rpx;
		// font-size: 20rpx;
	}
	.add-button{
		width:48rpx;
		height:48rpx;
		background-image:url('@/static/deviceImg/add-button.png') ;
		background-size: 100% 100%;
		margin-left: 10rpx;
		cursor: pointer;
	}
}
</style>
